<template>
  <div>
    <el-row>
      <el-col :span="24" class="expression"
        >某同学的综合成绩=<b style="color:yellow;">{{ result }}</b>
      </el-col>
    </el-row>
    <el-row style="width:550px;height:30px;font-size:20px;  margin-top: 10px;">
      <el-col :span="24">虚拟键盘</el-col>
    </el-row>
    <el-row style="width:570px;border:1px solid #000;">
      <el-button
        type="success"
        v-for="(item, index) in numlist"
        :key="index"
        @click="recordtext(item)"
        class="btn"
        >{{ item }}</el-button
      ></el-row
    >
  </div>
</template>

<script>
export default {
  created() {
    this.resultlist = this.$store.state.resultlist2;
  },
  computed: {
    result() {
      return this.resultlist.join("");
    },
  },

  data() {
    return {
      resultlist: [],
      numlist: [
        1,
        2,
        3,
        "+",
        "这位同学50米跑的排名",
        4,
        5,
        6,
        "-",
        "这位同学实心球的排名",
        7,
        8,
        9,
        "╳",
        "这位同学立定跳远的排名",
        "删除",
        0,
        ".",
        "÷",
        "这位同学的最好排名",
        "(",
        ")",
        "这位同学的最差排名",
      ],
    };
  },
  methods: {
    updata() {
      console.log(this.$store.state.pagenum, this.$store.state.answer);
      parent.postMessage(this.$store.state, "*");
    },
    recordtext(item) {
      if (item === "删除") {
        this.resultlist.pop();
      } else {
        this.resultlist.push(item);
      }
      this.$store.state.answer[6] = this.result;
      this.$store.state.resultlist2 = this.resultlist;
      this.updata();
    },
  },
};
</script>

<style scoped>
button {
  font-size: 20px;
  font-weight: 100;
  margin: 1px;
}
.btn {
  margin: 10px 6px;
  height: 46px;
}
</style>
